import AMapLoader from "@amap/amap-jsapi-loader";

function getZoom(distance) {
	var zoom = ["50", "100", "200", "500", "1000", "2000", "5000", "10000", "20000", "25000", "50000", "100000", "200000", "500000", "1000000", "2000000"]//级别18到3。
	for (var i = 0, zoomLen = zoom.length; i < zoomLen; i++) {
		if (zoom[i] - distance > 0) {
			return 18 - i + 1;//之所以会多3，是因为地图范围常常是比例尺距离的10倍以上。所以级别会增加3。
		}
	};
}

const generatorMarker = (lon, lat, msg) => new AMap.LabelMarker({
	position: [lon, lat],
	opacity: 1,
	zIndex: 99,
	icon: {
		image: "/web/xcx/static/aidex/images/dingwei.png",
		anchor: "bottom-center",
		size: [25, 25],
	},
	text: {
		content: msg,
		direction: "top",
		style: {
			fontSize: 14,
			fillColor: "#666",
			padding: [3, 10],
			backgroundColor: "#fff",
			borderColor: "#eaeaea",
			borderWidth: 1,
			fold: true
		},
	},
});

export default {
	data() {
		return {
			map: null,
			labelsLayer: null,
			scrollTop: window.screen.height * 0.2,
			location: {
				latitude: 120.161644,
				longitude: 30.251284,
			},
		}
	},
	props: {
		latitude: {
			type: Number,
		},
		longitude: {
			type: Number,
		},
		orderId: {
			type: String
		},
		phone: {
			type: String
		},
		runnerPhone: {
			type: String
		},
		orderInfo: {
			type: Object,
		},
		takeAddress: {
			type: String,
		},
		receiveAddress: {
			type: String,
		},
	},
	methods: {
		clip(text) {
			uni.setClipboardData({
				data: typeof text === 'string' ? text : this.orderInfo.tradeNo,
				showToast: true
			})
		},
		updateMarker(reposition) {
			if (!this.map) return
			let receiveLat
			let receiveLon
			let receiveMsg
			let takeLat
			let takeLon
			let takeMsg
			let runnerLat
			let runnerLon
			let runnerMsg
			const siteInfo = this.orderInfo.site || {};
			const addrInfo = this.orderInfo.addr || {};
			const runnerInfo = this.orderInfo.runner || {};
			if (this.orderInfo.serviceType === 1) {
				receiveLat = siteInfo.lat;
				receiveLon = siteInfo.lon;
				receiveMsg = '取： ' + siteInfo.address;
				takeLat = addrInfo.lat;
				takeLon = addrInfo.lon;
				takeMsg = '收：' + addrInfo.address;
			} else {
				receiveLat = addrInfo.lat;
				receiveLon = addrInfo.lon;
				receiveMsg = '取： ' + addrInfo.address;
				takeLat = siteInfo.lat;
				takeLon = siteInfo.lon;
				takeMsg = '收： ' + siteInfo.address;
			}
			runnerLon = runnerInfo.lon;
			runnerLat = runnerInfo.lat;
			runnerMsg = runnerInfo.name || '跑腿员'
			if (this.labelsLayer) {
				this.labelsLayer.clear();
				this.labelsLayer.hide();
				this.map.remove(this.labelsLayer);
				this.labelsLayer = null;
			}
			const receiveMarker = generatorMarker(receiveLon, receiveLat, receiveMsg);
			const takeMarker = generatorMarker(takeLon, takeLat, takeMsg);

			if (reposition) {
				this.map.setCenter([receiveLon, receiveLat]);
			}
			// const center = new AMap.Bounds([receiveLon, receiveLat], [takeLon, takeLat]).getCenter()
			this.labelsLayer = new AMap.LabelsLayer({
				collision: false,
			});

			var p1 = receiveMarker.getPosition();
			var p2 = takeMarker.getPosition();
			var textPos = p1.divideBy(2).add(p2.divideBy(2));
			var distance = Math.round(p1.distance(p2));

			this.labelsLayer.add(receiveMarker);
			this.labelsLayer.add(takeMarker);
			this.map.setZoom(getZoom(distance))
			if (reposition) {
				this.map.setCenter([textPos.lng, textPos.lat])
			}
			if (runnerLat) {
				this.labelsLayer.add(generatorMarker(runnerLon, runnerLat, runnerMsg))
			};
			this.map.add(this.labelsLayer);
		},
		initMap(longitude, latitude) {
			const self = this;
			const lat = this.latitude || latitude;
			const lon = this.longitude || longitude;
			if (this.map) {
				this.map.setCenter([lon, lat]);
				return Promise.resolve();
			}
			uni.showLoading({ title: '加载中' })
			return new Promise((res, rej) => {
				AMapLoader.load({
					key: "2d01e5cd2e390a130fd215d4014594fa", // 申请好的Web端开发者Key，首次调用 load 时必填
					version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
					plugins: [], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
					AMapUI: {
						// 是否加载 AMapUI，缺省不加载
						version: "1.1", // AMapUI 版本
						plugins: ["overlay/SimpleMarker"], // 需要加载的 AMapUI ui插件
					},
					Loca: {
						// 是否加载 Loca， 缺省不加载
						version: "2.0", // Loca 版本
					},
				}).then((AMap) => {
					self.map = new AMap.Map("map", {
						zoom: 17, //初始化地图级别
						center: lon ? [lon, lat] : undefined,
					});
					self.map.on('complete', function () {
						uni.hideLoading();
						console.log("地图图块加载完毕！当前地图中心点为：" + self.map.getCenter())
						res()
					});
				}, rej);
			});
		},
		cancelOrder() {
			const self = this;
			uni.showModal({
				content: "是否确认取消订单",
				success: (res) => {
					if (res.confirm) {
						self.$u.api
							.invokeCancelOrder({
								tradeNo: self.orderId
							})
							.then((res) => {
								if (res.code === 200) {
									uni.showToast({
										title: "取消成功"
									});
									self.$emit("onRefresh");
								}
							});
					} else { }
				},
			});
		},
	}
}
